﻿{% extends "zerogrid/base.html" %} 
{% block title %}{{title}}{% endblock %} 
{% block content %}
<!-----------syntax-highlighter js--------------->
<script type="text/javascript" src="/js/syntax-highlighter/scripts/shCore.js"></script>
<script type="text/javascript" src="/js/syntax-highlighter/scripts/shAutoloader.js"></script>
<link type="text/css" rel="stylesheet" href="/css/syntax-highlighter/styles/shCoreDefault_1_2.css"/>
<!-----------main Content--------------->

	<div class="wrap-col">
		{% if blog %}
		<article>
			<div class="heading">
				<h2>
					{{ blog.title }}
				</h2>
			</div>
			<div class="blog-info-small">
				<p>
				{% ifequal blog.type 1%}
					<span class="icon ico-original" title="原创文章" ></span>
				{% endifequal %}
				{% ifequal blog.type 0%}
					<span class="icon ico-repost" title="转帖文章" ></span>
				{% endifequal %}
				{% ifequal blog.type 2%}
					<span class="icon ico-trans" title="翻译文章" ></span>
				{% endifequal %}
					<span class="blockspan150">日期: {{ blog.time|date:"Y-m-d" }} </span> 
					<span class="blockspan150">分类: <a href="{% url 'group' blog.classify.id %}" title="{{ blog.classify.content }}" >{{ blog.classify.content }} </a></span>
					<span  class="blockspan">标签: 
					{% for tag in blog.tags %}
						<a href="{%url 'tag' tag.id %}" title="{{tag.content}}" >{{tag.content}}</a>
					{%endfor%}	
					</span>
				</p>
			</div>
			
			<div class="content">	
				<p>{% autoescape off %}  {{ blog.content }}  {% endautoescape %}</p>
			</div>
			
		</article>
	<div class="wrap-col  navPage">
	<span class="block-half-pre-next">上一篇：
	{% if blog.preBlog %}
		<a href="{% url 'blog' blog.preBlog.id%}" title="上一篇：{{ blog.preBlog.title }}">{{ blog.preBlog.title }}</a>
	{%else%}
	没有了...
	{% endif %}
	</span>
	<span class="block-half-pre-next"> 下一篇：
	{% if blog.nextBlog %}
		 <a href="{% url 'blog' blog.nextBlog.id%}" title="下一篇：{{ blog.nextBlog.title }}">{{ blog.nextBlog.title }}</a>
	{%else%}
	没有了...
	{% endif %}
	</span>
	</div>

	<section class="a-comments" id="leaved-messages">
	{% for comment in blog.comments %}
		<blockquote>
		  <p><a href="{{comment.website}}" target="_blank" >@{{comment.name}}</a>: {{comment.message}} <span class="small-span">{{comment.time|date:"Y-m-d"}}</span></p>
		</blockquote>	
	{%endfor%}
	</section>

		<section class="leave-a-comment col-3-4">
			<h3 style="color:gray;">留下您的只言片语</h3>

			<form id="contact-form" >
				<fieldset>
					<input type="hidden" name="blog_id"  id="blog_id"  value="{{ blog.id }}"/>
					<label><input class="DDD-box" name="name"  id="name" placeholder="Name ( Required)"  required="required"  /></label> 
						
					<label><input class="DDD-box"
						name="website"  id="website" placeholder="http://www.Website.com" /></label>
						
					<textarea class="DDD-box" name="message"  id="message" placeholder="Message ( Required 10~200 words )" required="required" ></textarea>
					
					<div class="buttons">
					<label class="block-inputRandom "><span style="cursor:pointer;" title="点击刷新验证码" id="autoRandom"  ONCLICK="autoRandom.innerHTML=createCode(5)">点击获取验证码</span><input type="text"  id="inputRandom"  class="inputRandom" placeholder=" 验证码 "/></label>
					
						<a  class="cursor-pointer"
							onClick="document.getElementById('contact-form').reset()" title="清除">清除</a>
						<a class="cursor-pointer" id="submit-a-message" title="发送" >发送</a>
					</div>
				</fieldset>
			</form>
		</section>

		{% else %}
		<article>
			<div class="heading">
				<h2>NO PAGES NOW [...]</h2>
			</div>
		</article>
		{% endif %}
	</div>

<script type="text/javascript">

function add_message(param){
	$.post("/edit/add_message/", param, function (result) { 
		if(result=="success"){
			$("#leaved-messages").append("<blockquote><p><a target='_blank' href='"+param.website+"'>@"+param.name+"</a>: "+param.message+"</p></blockquote>");
			document.getElementById('contact-form').reset();
		}
	});
}
function checkEveryElement(param){
	if(param.name==" " || param.name.length==0){
		$("#name").focus();
	}else if(param.message==" " || param.message.length<10){
		$("#message").focus();
	}else{
		return true;
	}
	return false;
}
	//发布文章
	  $("#submit-a-message").click(function(){
			var param={
					blog_id:"",
					name:"",
					website:"",
					message:""
			};
			param.blog_id = $("#blog_id").val();
			param.name = $("#name").val();
			param.website = $("#website").val();
			param.message = $("#message").val();

			if(checkEveryElement(param) &&autoRandomTest()){
				add_message(param);
				$("#autoRandom").click();
			}
	  });

</script>
    <SCRIPT LANGUAGE="JavaScript">
    	//生成一串随机数
        function createCode(len)
        {
            var seed = new Array(
                //    'abcdefghijklmnopqrstuvwxyz',
               //     'ABCDEFGHIJKLMNOPQRSTUVWXYZ',
                    '0123456789'
            );               //创建需要的数据数组
            var idx,i;
            var result = '';   //返回的结果变量
            for (i=0; i<len; i++) //根据指定的长度
            {
                idx = Math.floor(Math.random()*1); //获得随机数据的整数部分-获取一个随机整数
                result += seed[idx].substr(Math.floor(Math.random()*(seed[idx].length)), 1);//根据随机数获取数据中一个值
            }
            return result; //返回随机结果
        }
		//检测验证码
        function autoRandomTest() {
            var inputRandom=document.getElementById("inputRandom").value;
            var autoRandom=document.getElementById("autoRandom").innerHTML;
            if(inputRandom!="" && autoRandom!=""  && inputRandom==autoRandom) {
                return true;
            } else {
            	$("#inputRandom").focus();
                return false;
            }

        }
        
    	$(document).ready(function() {
    		//代码高亮
	    	SyntaxHighlighter.autoloader(
	                'applescript			/js/syntax-highlighter/scripts/shBrushAppleScript.js?t=1406837068000',
	                'actionscript3 as3		/js/syntax-highlighter/scripts/shBrushAS3.js?t=1406837068000',
	                'bash shell				/js/syntax-highlighter/scripts/shBrushBash.js?t=1406837068000',
	                'coldfusion cf			/js/syntax-highlighter/scripts/shBrushColdFusion.js?t=1406837068000',
	                'cpp c					/js/syntax-highlighter/scripts/shBrushCpp.js?t=1406837068000',
	                'obj-c objc				/js/syntax-highlighter/scripts/shBrushObjC.js?t=1406837068000',
	                'c# c-sharp csharp		/js/syntax-highlighter/scripts/shBrushCSharp.js?t=1406837068000',
	                'css					/js/syntax-highlighter/scripts/shBrushCss.js?t=1406837068000',
	                'delphi pascal			/js/syntax-highlighter/scripts/shBrushDelphi.js?t=1406837068000',
	                'diff patch pas			/js/syntax-highlighter/scripts/shBrushDiff.js?t=1406837068000',
	                'erl erlang				/js/syntax-highlighter/scripts/shBrushErlang.js?t=1406837068000',
	                'groovy					/js/syntax-highlighter/scripts/shBrushGroovy.js?t=1406837068000',
	                'haxe hx				/js/syntax-highlighter/scripts/shBrushHaxe.js?t=1406837068000',
	                'java					/js/syntax-highlighter/scripts/shBrushJava.js?t=1406837068000',
	                'jfx javafx				/js/syntax-highlighter/scripts/shBrushJavaFX.js?t=1406837068000',
	                'js jscript javascript	/js/syntax-highlighter/scripts/shBrushJScript.js?t=1406837068000',
	                'perl pl				/js/syntax-highlighter/scripts/shBrushPerl.js?t=1406837068000',
	                'php					/js/syntax-highlighter/scripts/shBrushPhp.js?t=1406837068000',
	                'text plain				/js/syntax-highlighter/scripts/shBrushPlain.js?t=1406837068000',
	                'py python				/js/syntax-highlighter/scripts/shBrushPython.js?t=1406837068000',
	                'ruby rails ror rb		/js/syntax-highlighter/scripts/shBrushRuby.js?t=1406837068000',
	                'scala					/js/syntax-highlighter/scripts/shBrushScala.js?t=1406837068000',
	                'sql					/js/syntax-highlighter/scripts/shBrushSql.js?t=1406837068000',
	                'vb vbnet				/js/syntax-highlighter/scripts/shBrushVb.js?t=1406837068000',
	                'xml xhtml xslt html	/js/syntax-highlighter/scripts/shBrushXml.js?t=1406837068000'
	        );	
	
	    	SyntaxHighlighter.all();
    	});
    </SCRIPT>
{% endblock %}

